<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Build an Event Flyer Page</title>
    <link rel="stylesheet" href="styles.css">
</head>

<body>
    <header>
        <img src="https://cdn.freecodecamp.org/curriculum/labs/event.jpg" alt="event">
        <h1>Pet Rock Festival</h1>
        <p>Join us for the first annual Pet Rock Festival!</p>
        <p><strong>When:</strong> October 3rd <strong>Where:</strong> Boulder Park</p>
    </header>
    <hr>
    <main>
        <section class="feature">
            <h2>Festival Highlights</h2>
            <ul>
                <li>Pet Rock Obedience Shows</li>
                <li>Best Dressed Pet Rock Contest</li>
                <li>Pet Rock Uphill Racing</li>
            </ul>
        </section>
        <section class="feature">
            <h2>Special Guests</h2>
            <ul>
                <li>John Gravel</li>
                <li>Wendy Cobblestone</li>
            </ul>
        </section>
        <section class="feature">
            <h2>Food Trucks</h2>
            <ul>
                <li>Rock 'n' Roll Tacos</li>
                <li>Granite Grill</li>
                <li>Stone Cold Smoothies</li>
            </ul>
        </section>
    </main>
    <hr>
    <footer>
        <p>&copy; 2025 Pet Rock Festival</p>
    </footer>
</body>

</html>